<!DOCTYPE html>
<html>
    <head>
        <title>Title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        
        <!-- Latest compiled and minified JavaScript -->
        <script type="text/javascript"  src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
        
        <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">

        <!-- Optional theme -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">

        <!-- Latest compiled and minified JavaScript -->
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
        
        <script type="text/javascript">
            var locationSearch = window.location.search.substring(1);

            var res = locationSearch.split("&");

            var config = {};

            for (var key in res){
                var resSub = res[key].split("=");
                config[resSub[0]] = resSub[1];
            }
            
            var dependecies = {};
            
            function loadDepends(p_depends) {
                try {
                    var retour = true;

                    for (var indice in p_depends) {
                        for (var indiceList in p_depends[indice].list) {
                            var name = p_depends[indice].name;
                            var lib = p_depends[indice].list[indiceList];
                            var strUrl = "pageResource?page="+config.page+"&location="+lib;
                            dependecies[lib] = false;
                            console.log("Loading : "+lib);
                            if(name == "css"){
                                $('<link/>', {
                                    rel: 'stylesheet',
                                    type: 'text/css',
                                    href: strUrl
                                }).appendTo('head');
                                dependecies[lib] = true;
                                console.log( "Sucess for : "+lib );
                            }else{
                                $.ajax({
                                    url: strUrl,
                                    dataType: "script",
                                    context : {"lib" : lib},
                                    success: function( script, textStatus, jqxhr) {
                                        console.log( "Sucess for : "+$(this)[0].lib+" ("+textStatus+")" );
                                        dependecies[$(this)[0].lib] = true;
                                        checkFullLoad();
                                    },
                                    fail : function( jqxhr, settings, exception ) {
                                        console.log( "Triggered ajaxError handler for : "+$(this)[0].lib+"." );
                                    }
                                });
                            }
                        }
                    }

                    return retour;
                } catch (er) {
                    console.log(er.message);
                    return null;
                }
            }
            
            function checkFullLoad(p_lib) {
                try {
                    var retour = true;

                    for (var indice in dependecies) {
                        retour = dependecies[indice];
                        if(!retour){break};
                    }
                    
                    if(retour){
                        angular.bootstrap(document, ['theApp']);
                        console.log('Load scripts done.');
                    }

                    return retour;
                } catch (er) {
                    console.log(er.message);
                    return null;
                }
            }
        </script>
        
        <style>    
        </style>
    </head>
    <body ng-app="theApp">
        <div ng-view></div>
        
        <!-- Angular Libs -->
        <script type="text/javascript"  src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
        <script type="text/javascript" src="https://code.angularjs.org/1.2.27/angular-route.min.js"></script>
        
        <script type="text/javascript">
            var app = angular.module('theApp',[]);
            
            loadDepends([
                {"name" : "css", "list" : ["css/appCss.css"]}
                , {"name" : "libs" , "list" : ["js/lib/ui-bootstrap-tpls.min.js"]}
                , {"name" : "configs" , "list" : ["js/config.js"]}
                , {"name" : "apps" , "list" : ["js/app.js"]}
                , {"name" : "Services" , "list" : ["js/services/service.js"]}
                , {"name" : "Controllers" , "list" : ["js/controllers/homeCtrl.js"]}
                , {"name" : "directives" , "list" : []}
            ]);
        </script>
    </body>
</html>

